<template>
  <div v-loading="state.dataForm.loading">
    <div class="contactTasks">
      <el-radio style="margin-right: -5px;"></el-radio>
      当前联络任务：{{ tskName }}
      <span style="margin-left: 50px;">选择主叫号码:</span>
      <el-cascader :options="options2iphone" clearable style="margin-left: 10px;width: 230px;" v-model="state.dataForm.caller"></el-cascader>
    </div>
    <div class="box" style="height:800px; margin-top: 5px;">
      <!-- 我的联络任务 -->
      <div class="left" style="margin-top: 10px;margin-left: 5px;">
        <div style="display: flex; margin-top:15px;">
          <div class="message" style="margin-left: 30px;">
            <span>|</span>人员基本信息
          </div>
        </div>
        <el-form label-position="right" label-width="85px" :model="state.dataForm" :rules="rules"
                 ref="dataFormRef"
                 style="flex-wrap: nowrap;display: flex;justify-content: flex-start;margin-top: 30px;">
          <el-row style="flex:6;height: 80px;">
            <el-col>
              <el-form-item label="中文姓名">
                <el-input v-model="state.dataForm.name" placeholder="请输入"></el-input>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="英文姓名">
                <el-input v-model="state.dataForm.ename" placeholder="请输入"></el-input>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="公司名称">
                <el-input v-model="state.dataForm.company" placeholder="请输入"></el-input>
              </el-form-item>
            </el-col>
            <label v-if="state.dataForm.mobileTip" style="color: red; font-size: 12px;height: 25px;margin-top: -10px;margin-left: 86px;">{{state.dataForm.mobileTip}}</label>
            <el-col>
              <el-form-item label="手机一" prop="mobile">
                <el-input v-model="state.dataForm.mobile" placeholder="请输入"></el-input>
                <el-button type="primary" plain @click.stop="callPhone(state.dataForm.mobile)"
                           :disabled="state.tcccStates === 'offline' ? true : false">拨打电话</el-button>
                <!-- <label style="color: red; font-size: 10px;height: 10px;margin-top: -10px;">{{state.dataForm.mobileTip}}</label> -->
              </el-form-item>
            </el-col>
            <label v-if="state.dataForm.mobile2Tip" style="color: red; font-size: 12px;height: 25px;margin-top: 0px;margin-left: 86px;">{{state.dataForm.mobile2Tip}}</label>
            <el-col>
              <el-form-item label="手机二" prop="mobile2">
                <el-input v-model="state.dataForm.mobile2" placeholder="请输入"></el-input>
                <el-button type="primary" plain @click.stop="callPhone(state.dataForm.mobile2)"
                           :disabled="state.tcccStates === 'offline' ? true : false">拨打电话</el-button>
                <!-- <label style="color: red; font-size: 10px;height: 10px;margin-top: -10px;">{{state.dataForm.mobile2Tip}}</label> -->
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="电话一">
                <el-input v-model="state.dataForm.tel" placeholder="请输入"></el-input>
                <el-button type="primary" plain @click.stop="callPhone(state.dataForm.tel)"
                           :disabled="state.tcccStates === 'offline' ? true : false">拨打电话</el-button>
                <!-- <el-button type="primary"  @click='phone(state.dataForm.tel)'  plain>拨打电话</el-button> -->
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="电话二">
                <el-input v-model="state.dataForm.tel2" placeholder="请输入"></el-input>
                <el-button type="primary" plain @click.stop="callPhone(state.dataForm.tel2)"
                           :disabled="state.tcccStates === 'offline' ? true : false">拨打电话</el-button>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="传真一">
                <el-input v-model="state.dataForm.fax1" placeholder="请输入"></el-input>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="传真二">
                <el-input v-model="state.dataForm.fax2" placeholder="请输入"></el-input>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="部门">
                <el-input v-model="state.dataForm.department" placeholder="请输入"></el-input>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="职位">
                <el-input v-model="state.dataForm.position" placeholder="请输入"></el-input>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="地址">
                <el-input v-model="state.dataForm.address" placeholder="请输入"></el-input>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="地址二">
                <el-input v-model="state.dataForm.address2" placeholder="请输入"></el-input>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="邮箱一" prop="email">
                <el-input v-model="state.dataForm.email" placeholder="请输入"></el-input>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="邮箱二" prop="email2">
                <el-input v-model="state.dataForm.email2" placeholder="请输入"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row style="flex:3">
            <el-col>
              <el-form-item label="微信">
                <el-input v-model="state.dataForm.wechat" placeholder="请输入"></el-input>
              </el-form-item>
            </el-col>
            <!-- <el-col>
            <el-form-item label="网址">
                <el-input v-model="state.dataForm.website" placeholder="请输入"></el-input>
            </el-form-item>
        </el-col> -->
            <el-col>
              <el-form-item label="类别">
                <ren-checkbox-group v-model="state.dataForm.category" dict-type="contact_category"
                                    style="width:400px"></ren-checkbox-group>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="行业">
                <el-input v-model="state.dataForm.industry" placeholder="请输入"></el-input>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="标签一">
                <el-input v-model="state.dataForm.extField1" placeholder="请输入"></el-input>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="标签二">
                <el-checkbox-group class="select" v-model="state.tag2Selected">
                  <el-checkbox v-for="item in state.tag2List" :key="item.id" :label="item.id"
                               :value="item.id" :title="item.label">
                                        <span v-if="item.label.length > 9" :title="item.label">{{
                                            item.label.substring(0, 9) }}...</span>
                    <span v-else>{{ item.label }}</span>
                  </el-checkbox>
                </el-checkbox-group>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="联络标签">
                <ren-radio-group v-model="state.dataForm.contactTag" style="margin-left: 20px;"
                                 dict-type="contact_tag"></ren-radio-group>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="产品">
                <el-input v-model="state.dataForm.productIntroduce" type="textarea" placeholder="请输入"
                          :autosize="{ minRows: 3.5, maxRows: 3.5 }"
                          style="width: 350px;white-space:pre-wrap;"></el-input>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="备注">
                <el-input v-model="state.dataForm.remark" type="textarea" placeholder="请输入"
                          :autosize="{ minRows: 3.5, maxRows: 3.5 }"
                          style="width: 350px;white-space:pre-wrap;"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </div>
      <!-- 中间 -->
      <div class="content"></div>
      <!-- 联络结果 -->
      <div class="right">
        <div style="display: flex; margin-top: 30px;margin-left: 20px; ">
          <div class="message">
            <span>|</span>设置本次联络结果
          </div>
        </div>
        <el-form label-position="right"  style="margin-top: 10px;margin-left: 30px;" :model="state.dataForm">
          <el-row>
            <el-form-item label="联络结果">
              <ren-radio-group v-model="state.dataForm.newLinkRecordDTO.lrdResult"
                               dict-type="contact-results" @change="clearSecondarySelection"
                               style="margin-left: 20px;"></ren-radio-group>
            </el-form-item>
            <div style="margin-top: -15px; margin-left:20px;">
              <!-- 未联络 -->
              <div v-if="state.dataForm.newLinkRecordDTO.lrdResult == '未联络'">
                <el-form-item>
                  <ren-radio-group
                    v-model="state.dataForm.newLinkRecordDTO.lrdReason"></ren-radio-group>
                </el-form-item>
              </div>
              <!-- 待联络 -->
              <div v-if="state.dataForm.newLinkRecordDTO.lrdResult == '待联络'">
                <el-form-item>
                  <ren-radio-group v-model="state.dataForm.newLinkRecordDTO.lrdReason"
                                   dict-type="wait_contact" style="width: 300px;"></ren-radio-group>
                </el-form-item>
              </div>
              <!-- 失败 -->
              <div v-if="state.dataForm.newLinkRecordDTO.lrdResult == '失败'">
                <el-form-item>
                  <ren-radio-group v-model="state.dataForm.newLinkRecordDTO.lrdReason"
                                   dict-type="telephone_fail" style="width: 300px;"></ren-radio-group>
                </el-form-item>
              </div>
              <!-- 不联络-->
              <div v-if="state.dataForm.newLinkRecordDTO.lrdResult == '不联络'">
                <el-form-item>
                  <ren-radio-group v-model="state.dataForm.newLinkRecordDTO.lrdReason"
                                   dict-type="no_contact" style="width: 300px;"></ren-radio-group>
                </el-form-item>
              </div>
              <!-- 已联络-->
              <div v-if="state.dataForm.newLinkRecordDTO.lrdResult == '已联络'">
                <el-form-item>
                  <ren-radio-group v-model="state.dataForm.newLinkRecordDTO.lrdReason"
                                   dict-type="telephone_contacted" style="width: 300px;"></ren-radio-group>
                </el-form-item>
              </div>
            </div>
            <el-col :span="16">
              <el-form-item label="联络备注">
                <el-input type="textarea" v-model="state.dataForm.newLinkRecordDTO.lrdRemark"
                          placeholder="请输入" style="width: 300px;"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="16">
              <el-form-item>
                <el-checkbox v-model="state.dataForm.ifBlacked" label="黑名单" />
                <el-checkbox v-model="state.dataForm.ifSkipCompany" :disabled="isCheckboxDisabled"
                             label="跳过同公司人员" />
              </el-form-item>
            </el-col>
            <el-col :span="16">
              <el-form-item>
                <el-button v-if="hasNextData" type="primary" @click="submission()"
                           :disabled="(isSubmissionDisabled || !hasNextData)">联络提交</el-button>
                <el-button v-else type="primary" disabled>暂无数据</el-button>
                <!--只有负责人、管理员显示下一条-->
                <el-button @click="next()" v-if="state.dataForm.isPrincipal"
                           :disabled="!hasNextData">下一条</el-button>
                <el-button @click="addOrUpdateHandle()">查看参会历史</el-button>
              </el-form-item>
            </el-col>
          </el-row>
          <div style=" margin-top: 20px;margin-left: -10px;">
            <div class="message">
              <span>|</span>
              联络历史
            </div>
          </div>
        </el-form>
        <el-form>
          <div v-for="(item, index) in state.dataForm.linkRecordDTOList" :key="index" class="histoty">
            <el-row>
              <el-text v-model="item.tskName">联络任务：{{ item.tskName }} </el-text>
            </el-row>
            <!-- <el-row>
                <el-text v-model="item.lrdPlanTime">联络过程：{{ item.lrdPlanTime }}</el-text>
            </el-row> -->
            <el-row>
              <el-text  v-model="item.lrdResult">联络结果：{{ item.lrdResult + '-' + item.lrdReason }}</el-text>
            </el-row>
            <el-row>
              <el-text v-model="item.remark">联络备注：{{ item.lrdRemark }}</el-text>
            </el-row>
            <el-row>
              <el-text v-model="item.personName">联络信息：{{ item.personName }}</el-text>
            </el-row>
          </div>
        </el-form>
      </div>
    </div>
    <!-- 查看参会历史 -->
    <add-or-update :key="addKey" ref="addOrUpdateRef" @refreshDataList="state.getDataList"></add-or-update>
  </div>
</template>
<script lang="ts" setup>
import useView from "@/hooks/useView";
import baseService from "@/service/baseService";
import { nextTick, reactive, ref, toRefs, onMounted, onUnmounted, computed } from "vue";
import { useRoute } from 'vue-router';
import { ElMessage, } from "element-plus";
import AddOrUpdate from "./history-attendance.vue";
const view = reactive({
  dataForm: {
    loading: false,
    tskId: "",
    psnId: "",
    tskType: "",
    id: "",
    name: "",
    ename: "",
    city: '',
    curLinkId: '',
    tel: "",
    tel2: '',
    telTip: '',
    tel2Tip: '',
    fax1: '',
    fax2: "",
    mobile: "",
    mobile2: "",
    mobileTip: '',
    mobile2Tip: '',
    email: "",
    email2: "",
    wechat: "",
    department: "",//部门
    position: "",//职务
    company: "",//公司
    website: "",//网址
    industry: "",//所属行业
    extField1: "",//标签一
    extField2: "",//标签二
    remark: "",//备注
    address: "",//地址
    address2: "",//英文地址
    category: "",//类别
    state: "",
    exhName: "",
    contactTag: "",
    productIntroduce: "",
    personName: "",//联络信息
    lrdRemark: "",//联络备注
    lrdResult: "",//联络结果
    lrdPlanTime: "",
    linkRecordDTOList: [] as any[],
    ifBlacked: false,//黑名单
    lrdLinkState: "",
    ifSkipCompany: false,//跳过同公司人员
    pageNum: 1,
    limit: 1,
    list: [],
    isPrincipal: false, // 只有负责人和管理员显示下一条
    newLinkRecordDTO: {
      tskId: "",
      psnId: "",
      lrdResult: '',
      lrdReason: '',
      lrdRemark: '',
      lrdCreateTime: '',
      tskName: '',
      personName: ''
    },
    caller:"",
  },
  tcccStates: "offline",
  tag2List: [] as any,
  tag2Selected: [] as any,
  total: 0
});


const dataFormRef = ref();

const clearSecondarySelection = () => {
  state.dataForm.newLinkRecordDTO.lrdReason = "";
};

//如果公司名称是空的，禁用跳过按钮
const isCheckboxDisabled = computed(() => {
  return state.dataForm.company === '';
});

//下一条 新增变量，用于判断是否有下一条数据
const hasNextData = ref(false);

// // 计算属性，判断是否禁用联络提交按钮
const isSubmissionDisabled = computed(() => {
  return (
    !state.dataForm.newLinkRecordDTO.lrdResult ||
    (
      (state.dataForm.newLinkRecordDTO.lrdResult === '已联络' &&
        !state.dataForm.newLinkRecordDTO.lrdReason) ||
      (state.dataForm.newLinkRecordDTO.lrdResult === '待联络' &&
        !state.dataForm.newLinkRecordDTO.lrdReason) ||
      (state.dataForm.newLinkRecordDTO.lrdResult === '失败' &&
        !state.dataForm.newLinkRecordDTO.lrdReason) ||
      (state.dataForm.newLinkRecordDTO.lrdResult === '不联络' &&
        !state.dataForm.newLinkRecordDTO.lrdReason)
    ) ||
    !state.dataForm.newLinkRecordDTO.lrdRemark
  );
});

//初始化
const init = () => {
  Info();
  checkTcccStates();
  getTag2();
  getTccPhone();
};

//接收过来的id
const route = useRoute();
const id = route.query.id;
const tskName = route.query.tskName;
const exhId = route.query.curExhId;
const pageNum1 = 1;
const pageNum = ref(1);

const rules = ref({
  mobile: [{ pattern: /^1[3-9]\d{9}$/, message: '手机号格式不正确', trigger: 'change' },],
  mobile2: [{ pattern: /^1[3-9]\d{9}$/, message: '手机号格式不正确', trigger: 'change' },],
  email: [{ pattern: /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/, message: '请输入正确的邮箱格式', trigger: 'change' },],
  email2: [{ pattern: /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/, message: '请输入正确的邮箱格式', trigger: 'change' },],
});

function validateEmail(email: string) {
  const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
  return emailRegex.test(email);
}

//获取登录人是否为负责人
const Info = () => {
  baseService.get("crm/crmlinkrecord/ifPrincipal/" + id).then((res) => {
    state.dataForm.isPrincipal = res.data
  });
};

//获取回显数据
let curLrdId: string;
baseService.get("/crm/crmperson/contactCenter/" + id + "/" + pageNum1).then((res) => {
  if (res.code == 500) {
    hasNextData.value = false;
    ElMessage({
      message: '暂无数据',
      type: 'warning'
    });
    return;
  }
  if (res.data.list.length > 0) {
    hasNextData.value = true;
    const item = res.data.list[0];
    Object.assign(state.dataForm, item);
    curLrdId = item.curLrdId;
    state.dataForm.newLinkRecordDTO = {} as any;
    var extField2 = item.extField2;
    if (extField2) {
      let field2Str = extField2.split(",");
      state.tag2Selected = field2Str.map((item: any) => {
        return parseInt(item);
      });
      state.dataForm.extField2 = extField2.split(",");
    } else {
      state.dataForm.extField2 = [] as any;
    }
  }

  isJoinMobile();
  isJoinMobile2();
});

//获取标签二
const getTag2 = () => {
  baseService.get("crm/crmperson/tag2List").then((res) => {
    state.tag2List = res.data;
  });
};

//联络提交
const submission = () => {
  // 检查手机或电话至少有一项有值
  const hasMobileValue = state.dataForm.mobile || state.dataForm.mobile2;
  const hasTelValue = state.dataForm.tel || state.dataForm.tel2;
  if (!hasMobileValue && !hasTelValue) {
    ElMessage.error("手机和电话必须要有一个联系方式");
    return;
  }

  // 验证手机号2个框的值非空时不能相同
  if (state.dataForm.mobile && state.dataForm.mobile2 && state.dataForm.mobile === state.dataForm.mobile2) {
    ElMessage.error("手机一和手机二不能相同");
    return;
  }

  // 验证电话2个框的值非空时不能相同
  if (state.dataForm.tel && state.dataForm.tel2 && state.dataForm.tel === state.dataForm.tel2) {
    ElMessage.error("电话一和电话二不能相同");
    return;
  }

  // 验证邮箱一格式是否正确
  if (state.dataForm.email &&!validateEmail(state.dataForm.email)) {
    ElMessage.error("请填写正确的邮箱格式");
    return;
  }

  // 验证邮箱二格式是否正确
  if (state.dataForm.email2 &&!validateEmail(state.dataForm.email2)) {
    ElMessage.error("请填写正确的邮箱格式");
    return;
  }

  dataFormRef.value.validate((valid: boolean) => {
    if (!valid) {
      return false;
    }
    state.dataForm.extField2 = state.tag2Selected.join(",");
    state.dataForm.loading = true;
    return baseService.put("/crm/crmperson/saveContact", state.dataForm).then((res) => {
      if (res.code == 0) {
        state.getDataList();
        ElMessage.success("联络提交成功");
        state.dataForm.loading = false;
        // 自动进入下一条, 页面置为0
        pageNum.value = 0;
        next();
      }
    })
      .catch((error) => {
        state.dataForm.loading = false;
      });
  });
};


//下一条
const next = () => {
  if (hasNextData.value) {
    state.dataForm.loading = true;
    pageNum.value++;
    baseService.get("/crm/crmperson/contactCenter/" + id + "/" + pageNum.value,
      { limit: state.dataForm.limit }
    ).then((res) => {
      Object.assign(state.dataForm, res.data.list[0]);
      // 重置联络结果
      state.dataForm.newLinkRecordDTO = {} as any;
      state.dataForm.ifSkipCompany = false;
      // 处理extField2和tag2Selected
      var extField2 = state.dataForm.extField2;
      if (extField2) {
        let field2Str = extField2.split(",");
        state.tag2Selected = field2Str.map((item: any) => {
          return parseInt(item);
        });
      } else {
        state.tag2Selected = [];
      }
      state.dataForm.loading = false;
      //判断手机号是否注册了预登记展会
      isJoinMobile();
      isJoinMobile2();
    }).catch((err) => {
      // 如果没有数据返回，说明没有下一条数据，设置hasNextData为false
      hasNextData.value = false;
      state.dataForm.loading = false;
    });
  }
};
// const next = () => {
//     if (hasNextData.value) {
//         state.dataForm.loading = true;
//         pageNum.value++;
//         baseService.get("/crm/crmperson/contactCenter/" + id + "/" + pageNum.value,
//             { limit: state.dataForm.limit }
//         ).then((res) => {
//             Object.assign(state.dataForm, res.data.list[0]);
//             // 重置联络结果
//             state.dataForm.newLinkRecordDTO = {} as any;
//             state.dataForm.ifSkipCompany = false;
//             state.dataForm.ifBlacked = false
//             state.dataForm.loading = false;
//         }).catch((err) => {
//             // 如果没有数据返回，说明没有下一条数据，设置hasNextData为false
//             hasNextData.value = false;
//             state.dataForm.loading = false;
//         });
//     }
// };

//查询电话状态
const checkTcccStates = () => {

  // baseService.get("tccc/getToken").then((res) => {
  //   // 如果返回200，说明当前用户未登录坐席
  //   if (res.data === '200') {
  //     return;
  //   }
  //   // 查询getSeatStatus接口
  //   baseService.get("tccc/getSeatStatus").then((r) => {
  //     if (r.data === 'offline') {
  //       state.tcccStates = "offline";
  //     } else {
  //       state.tcccStates = "online";
  //     }
  //   });
  // });
};

let timer: any
onMounted(() => {
  checkTcccStates();
  timer = setInterval(checkTcccStates, 30000); // 每 30 秒调用一次
});

onUnmounted(() => {
  clearInterval(timer); // 组件卸载时清除定时器
});


const options2iphone = ref([]);

//获取电话号码
const getTccPhone = () => {
  baseService.get("/tccc/getTccPhone").then((res) => {
    options2iphone.value = res.data.list;
  });
};

/**
 * 拨打电话
 * @param phone
 */
const callPhone = (phone: any) => {
  if (!phone) {
    ElMessage.error("被叫号码不能为空！");
    return;
  }
  if (phone.length < 10) {
    ElMessage.error("被叫号码长度不对！");
    return;
  }
  //判断字符串是否为数字//判断正整数/[1−9]+[0−9]∗]∗/
  var re = /^[0-9]+.?[0-9]*/;
  if (!re.test(phone)) {
    ElMessage.error("只能输数字！");
    return;
  }

  // 呼叫号码
  let callerPhoneNumber = state.dataForm.caller;
  let callOutParams: { phoneNumber: string; callerPhoneNumber?: string } = { phoneNumber: phone };
  // 有值的话，取第二个值并添加到参数中
  if (callerPhoneNumber) {
    callerPhoneNumber = callerPhoneNumber[1];
    callOutParams.callerPhoneNumber = "0086" + callerPhoneNumber;
  }

  //有值的话，取第二个值
  if (callerPhoneNumber) {
    callerPhoneNumber = callerPhoneNumber[1];
  }
  baseService.get("/tccc/checkcallPhone?callee=" + phone).then((res: any) => {
    if (res.count > 2) {
      ElMessage.error("同一个被叫号码当日限制外呼两次，请注意频次，避免投诉！");
      return;
    } else {
      //开始外呼
      const reponse = (window as any).tccc.callOut(callOutParams);
      reponse.then((res: any) => {
        baseService.post('/crm/crmtelhistory', { psnId: state.dataForm.id, tskId: id, sessionId: res.data.sessionId, timestamp: res.data.timestamp, exhId: exhId, lrdId: curLrdId }).then((res: any) => {
          console.log(res);
        })
      })
        .catch((err: any) => {
          console.log(err);
        })
    }
  });
};

//是否报名当前展会
const isJoinMobile = () => {
  state.dataForm.mobileTip = ''
  baseService.post("/crm/crmperson/isJoin", {phone: state.dataForm.mobile}).then((res) => {
    if (res.data>0) {
      state.dataForm.mobileTip = '手机号'+state.dataForm.mobile+'已在当前展会预登记成功';
    }
  });
};

const isJoinMobile2 = () => {
  state.dataForm.mobile2Tip = ''
  baseService.post("/crm/crmperson/isJoin", {phone: state.dataForm.mobile2}).then((res) => {
    if (res.data>0) {
      state.dataForm.mobile2Tip = '手机号'+state.dataForm.mobile2Tip+'已在当前展会预登记成功';
    }
  });
};

const state = reactive({ ...useView(view), ...toRefs(view) });

const addKey = ref(0);
const addOrUpdateRef = ref();
const addOrUpdateHandle = (id?: number) => {
  addKey.value++;
  nextTick(() => {
    addOrUpdateRef.value.init(id);
  });
};

//页面进入执行
init();

</script>
<style lang="scss" scoped>
.message {
  height: 20px;
  font-size: 14px;
  font-weight: 600;
  margin-left: -5px;
}

.el-col {
  margin-top: -3px;
}

.el-input {
  width: 180px;
}

.el-select {
  width: 180px;
}

.box {
  margin: -20px;
  display: flex;
  flex-wrap: nowrap;

  .left {
    width: 90%;
    height: 100%;
    scrollbar-width: none;
    overflow-y: scroll;

  }

  .right {
    width: 60%;
    height: 100%;
    scrollbar-width: none;
    overflow-y: scroll;
  }

  .content {
    width: 10px;
    background-color: #F0F2F5;

  }
}

.el-button {
  margin-left: 10px;
}

.histoty {
  border-radius: 10px 10px 10px 10px;
  margin-top: 20px;
  margin-left: 30px;
  width: 370px;
  background: linear-gradient(-87.99deg, rgba(249, 249, 249, 1) 1.33%, rgba(232, 250, 248, 1) 97.67%);
}

.el-text {
  padding: 5px 5px 5px 5px;
  margin-left: 10px;
}

.el-form-item::v-deep {
  .el-checkbox-group {
    .el-checkbox {
      width: 140px;
    }
  }
}

.el-form-item::v-deep {
  .el-radio-group {
    .el-radio {
      margin-left: -20px !important;
    }
  }
}

.contactTasks {
  height: 20px;
  font-size: 16px;
  font-weight: 600;
  color: #17B3A3;
}

.message span {
  width: 10px;
  height: 30px;
  color: #17B3A3;
  background-color: #17B3A3;
  margin-right: 10px;
}
.select{
  width: 518px;;
}

@media (max-width: 1700px) {
  .select {
    width: 400px!important;
  }
}
</style>
